/**
* Created by wl
* 基金储备库-编辑项目储备信息
*/
<template>
    <div>
        <div class="ca-title">
            <div class="el-right">
                <el-button type="primary" size="small" @click="save">保存</el-button>
                <el-button @click="close" size="small">取消</el-button>
            </div>
        </div>
        <el-form ref="itemInfoRule" :model="itemInfo">
            <table class="ca-table ca-m-t-15" :model="itemInfo">
                <tr>
                    <th width="10%">项目名称</th>
                    <th width="10%">公司名称</th>
                    <th width="10%">行业</th>
                    <th width="10%">地域</th>
                    <th width="10%">阶段</th>
                    <th width="15%">成立时间</th>
                    <th width="10%">计划投资金额</br>（万元）</th>
                    <th width="20%">备注</th>
                    <th @click="addExecutive"><i class="el-add">+</i></th>  
                </tr>
                <tr v-for="(item, index) in itemInfo.itemHoldHighManagerEntities" :key="index">
                    <td>
                        <el-form-item>
                            <el-input type="text" v-model="item.itemName" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="text" v-model="item.company" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="text" v-model="item.industry" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="text" v-model="item.region" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="text" v-model="item.stage" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-date-picker
                            v-model="item.establishTime"
                            type="date"
                            placeholder="选择日期"
                            style="width:100%">
                            </el-date-picker>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="number" v-model="item.investment" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td>
                        <el-form-item>
                            <el-input type="textarea" :rows="2" resize="none" v-model="item.remarks" :maxlength="100"></el-input>
                        </el-form-item>
                    </td>
                    <td class="btn-mid" width="120px;" @click="delExecutive(item.id,index)"><i class="el-icon-close el-del"></i></td>
                </tr>
            </table>
        </el-form>
    </div>
</template>
<script type="text/ecmascript-6">
    import {api} from '../../api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    export default {
        data() {
            return {
                dialogVisible: false,
                dialogEdit: false,
                value: '',
                executivesList: {
                    company: '', //公司名称
                    establishTime: '', //成立时间
                    fundId: this.$route.params.itemId, //基金id
                    id: '', //主id
                    industry: '', //行业
                    investment: '', //计划投资金额（万元)
                    itemName: '', //项目名称
                    region: '', //地域
                    remarks: '', //备注
                    stage: '', //阶段
                }, //信息列表
                itemInfo: {
                    itemHoldHighManagerEntities: [],
                },
            }
        },
        watch: {
        },
        props: {
        },
        mounted() {
            this.getInfo()
        },
        methods: {
            close() {
                this.$emit('close')
            },
            showDialog() {
                this.dialogEdit = false
                this.dialogVisible = true
            },
            showDialogEdit() {
                this.dialogEdit = true
                this.dialogVisible = true
            },
            // 添加管理团队
            addExecutive() {
                this.itemInfo.itemHoldHighManagerEntities.push(Object.assign({}, this.executivesList));
            },
            // 删除管理团队
            delExecutive(id,index) {
                let that = this
                this.$confirm('确定要删除此信息吗?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(function () {
                    //删除操作
                    if (id) {
                        apiHttp(api.DELETE_PROJECTRESERVE, {id: id}).then(ret => {
                            if (ret.resCode === STATUS_HTTP_SUCCESS) {
                                that.$message({
                                    message: '数据删除成功！',
                                    type: 'success',
                                    center: true
                                });
                                that.itemInfo.itemHoldHighManagerEntities.splice(index, 1)
                            }
                        })
                    } else {
                        that.itemInfo.itemHoldHighManagerEntities.splice(index, 1)
                        that.$message({
                            message: '数据删除成功！',
                            type: 'success',
                            center: true
                        });
                    }
                })
            },
            getInfo() {
                apiHttp(api.CHECK_PROJECTRESERVE, {id: this.$route.params.itemId}).then(ret=> {
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.itemInfo.itemHoldHighManagerEntities = ret.data
                    }
                })
            },
            save() {
                let flag = false;
                if (this.itemInfo.itemHoldHighManagerEntities.length > 0) {
                    this.itemInfo.itemHoldHighManagerEntities.map(item => {
                        if (!item.itemName) {
                            flag = false;
                            this.$message({
                                message: '请输入项目名称',
                                type: 'error',
                                center: true
                            });
                            return false;
                        } else {
                            flag = true;
                        }
                    })
                } else {
                    flag = true
                }
                if (flag) {
                    apiHttp(api.SAVE_PROJECTRESERVE, this.itemInfo.itemHoldHighManagerEntities).then(ret=> {
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                message: '数据保存成功！',
                                type: 'success',
                                center: true
                            });
                            this.$emit('update')
                        }
                    })
                }
            },
        },
        components: {
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.el-right {
    float: right;
}
.el-size {
    font-size: 30px;
}
.input-mid {
    display: table-cell;
    vertical-align: middle;
}
.btn-min {
    display: table-cell;
    vertical-align: middle;
    cursor: pointer;
}
table td{
    padding: 5px 5px;
    box-sizing: border-box;
}
.el-form-item {
    margin-bottom: 0px;
}
.ca-table th {
    line-height: 20px;
}
.el-delete {
    color: red;
}
.el-add {
    width: 25px!important;
    height:25px!important;
    background: #ffffff!important;
    border-radius: 50%;
    padding:0 0 !important;
    margin-left:4px;
    border: solid 1px #dbe3ea;
    box-shadow: 0px 2px 2px 0 rgba(104, 119, 133, 0.08);
    font-size: 24px;
    color: #d70c18;
    line-height: 16px;
    cursor: pointer;
    text-align: center!important;
    display: inline-block;
    &:hover{
        border: solid 1px #409EFF;
    }
}
.el-del {
    width: 25px!important;
    height:25px!important;
    background: #ffffff!important;
    border-radius: 50%;
    padding: 0;
    border: solid 1px #dbe3ea;
    box-shadow: 0px 2px 2px 0 rgba(104, 119, 133, 0.08);
    font-size: 20px;
    color: #d70c18;
    cursor: pointer;
    text-align: center!important;
    &:hover{
        border: solid 1px #409EFF;
    }
}
</style>